<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:include page="global.jsp"></jsp:include>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>我的任务</title>
<style type="text/css">
.ctl{
	text-decoration: none;
	color: blue;
	margin: auto 7px;
}
.ctl:HOVER{
	text-decoration: underline;
}
.center{
	text-align: center;
}
</style>
</head>
<body>
	<table id="dg" class="easyui-datagrid" title="我的任务"
			data-options="
				rownumbers:true,
				iconCls: 'icon-edit',
				singleSelect: true,
				toolbar: '#tb',
				singleSelect:true,
				pagination:true,
				fit:true,
				fitColumns:true,
				pageList:[20,25,30,35,40,45,50],
				pageSize:20
			">
		<thead>
			<tr>
				<th data-options="field:'projectName',width:60,align:'center'">项目</th>
				<th data-options="field:'projectTaskTypeName',width:30,align:'center'">任务类型</th>
				<th data-options="field:'projectTaskTaskDescription',width:80,align:'center'">任务描述</th>
				<th data-options="field:'duty',width:40,align:'center'">职责</th>
				<th data-options="field:'firstPlanFinishDate',width:50,align:'center'">初次计划完成日期</th>
				<th data-options="field:'planFinishDate',width:40,align:'center'">计划完成日期</th>
				<th data-options="field:'actualFinishDate',width:40,align:'center'">实际完成日期</th>
				<th data-options="field:'chargePersonSign',width:20,align:'center',formatter:function(val, row){return val == 'Y'?'是':'否'}">责任人</th>
				<th data-options="field:'chargePersonSignPersonName',width:30,align:'center'">主责任人</th>
				<th data-options="field:'status',width:25,align:'center'">状态</th>
				<th data-options="field:'id',width:50,formatter:formatControl,align:'center'">管理</th>
			</tr>
		</thead>
	</table>

	<div id="tb" style="height:auto">
		<div>
			项目名称:
			<select data-options="editable: false" id = "project" class="easyui-combobox">
				<option value = "-1"> --全部-- </option>
				<c:forEach var="item" items="${projects }" >
					<option value = "${item.id }">${item.name }</option>
				</c:forEach>
			</select>
			任务类型:
			<select data-options="editable: false" id = "projectTaskType" class="easyui-combobox">
				<option value = "-1"> --全部-- </option>
				<c:forEach var="item" items="${projectTaskTypes }" >
					<option value = "${item.id }">${item.name }</option>
				</c:forEach>
			</select>
			主责任人:
			<select data-options="editable: false" id = "chargePersonSign" class="easyui-combobox">
				<option value = ""> --全部-- </option>
				<option value = "Y">是</option>
				<option value = "N">否</option>
			</select>
			状态：
			<select data-options="editable: false" id = "status" class="easyui-combobox">
				<option value = ""> --全部-- </option>
				<option value = "0001">未领取</option>
				<option value = "0055">进行中</option>
				<option value = "0200">申请延期</option>
				<option value = "0100">申请完结</option>
				<option value = "3000">已完成</option>
			</select>
			发布时间: <input class="easyui-datebox" type="text" id="taskPublishTimeBegin" style="width:100px;height:25px;">
			~ <input class="easyui-datebox" type="text" id="taskPublishTimeEnd" style="width:100px;height:25px;">
			<a href="javascript:search()" class="easyui-linkbutton" iconCls="icon-search">查 找</a>
		</div>
	</div>
	
	<div id="lookDetail" class="easyui-window" title="查看我的项目任务详情" data-options="modal:true,closed:true,iconCls:'icon-search'" style="width:1000px; height:600px;padding:5px;">
		<div class="easyui-layout" data-options="fit:true">
			<div data-options="region:'center'" style="padding:10px;">
				<iframe id="lookProjectTaskPersonDetailPage" width="100%" height="100%" frameborder="0"></iframe>
			</div>
			<div data-options="region:'south',border:false" style="text-align:right;padding:5px 0 0;">
				<a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" href="javascript:void(0)" onclick="javascript:$('#lookDetail').window('close')" style="width:80px">关 闭</a>
			</div>
		</div>
	</div>
	
	<div id="applyDelay" class="easyui-window" title="项目任务延期申请" data-options="modal:true,closed:true,iconCls:'icon-search'" style="width:720px; height:280px;padding:5px;">
		<div class="easyui-layout" data-options="fit:true">
			<div data-options="region:'center'" style="padding:10px;">
				<form id="applyDelayForm" method="post" action="editProjectTaskDelayApply" style = "width:100%; height: 100%">
					<input type="hidden" name="projectTaskPerson.id" id="applyDelayProjectTaskPersonId" />
					<input type="hidden" name="status" id="applyDelayProjectTaskStatus" />
					<input type="hidden" name="applyPerson.id" id="applyDelayApplyPersonId" />
					<table width="100%" height="100%">
						<tr>
							<td align="right">原计划完成日期：</td>
							<td>
								<input class="easyui-datebox" name="originalPlanFinishDate" id="applyDelayOriginalPlanFinishDate" data-options="required:true" style="width: 200px;" readonly="readonly" />
							</td>
							<td align="right">目标计划完成日期：</td>
							<td>
								<input class="easyui-datebox" name="targetPlanFinishDate" id="applyDelayTargetPlanFinishDate" data-options="required:true" style="width: 200px;" />
							</td>
						</tr>
						<tr>
							<td align="right">申请理由：</td>
							<td colspan="3">
								<input class="easyui-textbox" data-options="multiline:true, required:true" style="width: 550px; height: 120px;" name="applyReason">
							</td>
						</tr>						
					</table>
				</form>
			</div>
			<div data-options="region:'south',border:false" style="text-align:right;padding:5px 0 0;">
				<a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)" onclick="javascript:$('#applyDelayForm').submit()" style="width:80px">申请延期</a>
				<a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" href="javascript:void(0)" onclick="javascript:$('#applyDelay').window('close')" style="width:80px">关 闭</a>
			</div>
		</div>
	</div>
	
	<div id="applyFinish" class="easyui-window" title="项目任务完成申请" data-options="modal:true,closed:true,iconCls:'icon-search'" style="width:650px; height:260px;padding:5px;">
		<div class="easyui-layout" data-options="fit:true">
			<div data-options="region:'center'" style="padding:10px;">
				<form action="editProjectTaskFinishApply" method="POST" id="applyFinishForm">
					<input type="hidden" name="projectTaskPerson.id" id="applyFinishProjectTaskPersonId" />
					<input type="hidden" name="status" id="applyFinishApplyStatus" />
					<input type="hidden" name="applyPerson.id" id="applyFinishApplyPersonId" />
					<table width="100%" height="100%">
						<tr>
							<td align="right" width="100px">计划工时数：</td>
							<td>
								<input class="easyui-textbox" id="applyFinishProjectTaskPlanWorktime" style="width: 200px;" readonly="readonly" />
							</td>
							<td align="right" width="100px">填报工时数：</td>
							<td>
								<input class="easyui-textbox" data-options="required:true" name="projectTaskPerson.originalConsumeWorktime" id="applyFinishProjectTaskProjectTaskPersonOriginalConsumeWorktime" style="width: 200px;" />
							</td>
						</tr>
						<tr>
							<td align="right">申请说明：</td>
							<td colspan="3">
								<input class="easyui-textbox" data-options="multiline:true" style="width: 505px; height: 120px;" name="applyDescription">
							</td>
						</tr>
					</table>
				</form>
			</div>
			<div data-options="region:'south',border:false" style="text-align:right;padding:5px 0 0;">
				<a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)" onclick="javascript:$('#applyFinishForm').submit()" style="width:80px">申请完成</a>
				<a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" href="javascript:void(0)" onclick="javascript:$('#applyFinish').window('close')" style="width:80px">关 闭</a>
			</div>
		</div>
	</div>
	
	<script type="text/javascript">
		function formatControl(val, row){
			var content = '<a class="ctl" href="javascript:void(0)" onclick="lookDetail(' + val + ')">查看</a>';
			if(row.statusCode == '0001'){
				content += ' <a class="ctl" href="javascript:void(0)" onclick="accept(' + val + ')">领取任务</a>';
			}else if(row.statusCode == '0055') {
				content += ' <a class="ctl" href="javascript:void(0)" onclick="applyDelay(' + val + ', \'' + row.planFinishDate + '\')">延期</a>';
				content += ' <a class="ctl" href="javascript:void(0)" onclick="applyFinish(' + val + ', \'' + row.planWorktime + '\')">完成</a>';
			}else if(row.statusCode == '0200'){
				content += ' <a class="ctl" href="javascript:void(0)" onclick="revocationDelayApplyProjectTaskPerson(' + val + ')">撤销延期申请</a>';
			}else if(row.statusCode == '0100'){
				content += ' <a class="ctl" href="javascript:void(0)" onclick="revocationFinishApplyProjectTaskPerson(' + val + ')">撤销完成申请</a>';
			}
			return content;
		}
		function search(){
			var project = $("#project").combobox("getValue");
			var projectTaskType = $("#projectTaskType").combobox("getValue");
			var chargePersonSign = $("#chargePersonSign").combobox("getValue");
			var status = $("#status").combobox("getValue");
			var taskPublishTimeBegin = $("#taskPublishTimeBegin").textbox("getValue").trim();
			var taskPublishTimeEnd = $("#taskPublishTimeEnd").textbox("getValue").trim();
			var url = "queryMyProjectTask?peopleId=${currentUser.id}&projectId=" + project + "&projectTaskTypeId=" + projectTaskType + "&taskPublishTimeBegin=" + taskPublishTimeBegin + "&taskPublishTimeEnd=" + taskPublishTimeEnd + "&chargePersonSign=" + chargePersonSign + "&status=" + status;
			
			$("#dg").datagrid('reload', url);
		}
		function lookDetail(id){
			var url = "myProjectTaskDetail?id=" + id;
			$("#lookProjectTaskPersonDetailPage").attr("src", url);
			$('#lookDetail').window('open');
		}
		function accept(id){
			$.messager.confirm("项目任务领取", "您确定要领取所选的项目任务吗？", function(r){
				if(r){
					data = "id=" + id + "&status=0055";
					$.ajax({
					  type: "GET",
					  url: "acceptProjectTaskPerson",
					  data: data,
					  success:function(data){
						  	var val = $.parseJSON(data);
							if(val.success){
								bottomRight('提示', "项目任务领取成功！");
								$('#dg').datagrid('reload');
							}else{
								$.messager.alert("提示", val.msg, "error");
							}
					  }
					});
				}
			});
		}
		function revocationDelayApplyProjectTaskPerson(id){
			$.messager.confirm("项目任务领取", "您确定要撤销所选的项目任务延期申请吗？", function(r){
				if(r){
					data = "id=" + id + "&status=0055";
					$.ajax({
					  type: "GET",
					  url: "revocationDelayApplyProjectTaskPerson",
					  data: data,
					  success:function(data){
						  	var val = $.parseJSON(data);
							if(val.success){
								bottomRight('提示', '撤销成功！');
								$('#dg').datagrid('reload');
							}else{
								$.messager.alert("提示", val.msg, "error");
							}
					  }
					});
				}
			});
		}
		function revocationFinishApplyProjectTaskPerson(id){
			$.messager.confirm("项目任务领取", "您确定要撤销所选的项目任务完成申请吗？", function(r){
				if(r){
					data = "id=" + id + "&status=0055";
					$.ajax({
					  type: "GET",
					  url: "revocationFinishApplyProjectTaskPerson",
					  data: data,
					  success:function(data){
						  	var val = $.parseJSON(data);
							if(val.success){
								bottomRight('提示', '撤销成功！');
								$('#dg').datagrid('reload');
							}else{
								$.messager.alert("提示", val.msg, "error");
							}
					  }
					});
				}
			});
		}
		function applyDelay(id, planFinishDate){
			clearForm("applyDelayForm", "applyDelay");
			$("#applyDelayProjectTaskPersonId").val(id);
			$("#applyDelayProjectTaskStatus").val('0200');
			$("#applyDelayApplyPersonId").val('${currentUser.id}');
			$("#applyDelayOriginalPlanFinishDate").textbox("setValue", planFinishDate);
			
			$('#applyDelay').window('open');
		}
		function applyFinish(id, planWorktime){
			clearForm("applyFinishForm", "applyFinish");
			$("#applyFinishProjectTaskPersonId").val(id);
			$("#applyFinishApplyStatus").val('0100');
			$("#applyFinishApplyPersonId").val('${currentUser.id}');
			$("#applyFinishProjectTaskPlanWorktime").textbox("setValue", planWorktime);
			$("#applyFinishProjectTaskProjectTaskPersonOriginalConsumeWorktime").textbox("setValue", planWorktime);
			
			$('#applyFinish').window('open');
		}
		$(function(){
			$("#acceptForm").form({
				onSubmit: function(){
					var isValid = $(this).form('validate');
					return isValid;	// 返回false将停止form提交 
			    },
				success:function(data){
					var val = $.parseJSON(data);
					if(val.success){
						$('#dg').datagrid('reload');
						bottomRight('提示', '操作成功！');
						$('#accept').window('close');
					}else{
						$.messager.alert("提示", val.msg, "error");
					}
				}
			});
			$("#applyDelayForm").form({
				onSubmit: function(){
					var isValid = $(this).form('validate');
					return isValid;	// 返回false将停止form提交 
			    },
				success:function(data){
					var val = $.parseJSON(data);
					if(val.success){
						bottomRight('提示', '操作成功！');
						$('#applyDelay').window('close');
					}else{
						$.messager.alert("提示", val.msg, "error");
					}
					$('#dg').datagrid('reload');
				}
			});
			$("#applyFinishForm").form({
				onSubmit: function(){
					var isValid = $(this).form('validate');
					return isValid;	// 返回false将停止form提交 
			    },
				success:function(data){
					var val = $.parseJSON(data);
					if(val.success){
						bottomRight('提示', '操作成功！');
						$('#applyFinish').window('close');
					}else{
						$.messager.alert("提示", val.msg, "error");
					}
					$('#dg').datagrid('reload');
				}
			});
			search();//页面装载完成后加载数据
		});
	</script>
</body>
</html>